<template>
    <div class="tab">
        <el-tabs v-model="activeName" @tab-click="handleClick">
            <el-tab-pane label="扶贫资讯" name="first">
                <div class="content">
                    <HelpPoorInfo v-for="item in helpPoorArr" :key="item.id" :helpPoorArr="item" @goDetail="goDetail(item)">
                    </HelpPoorInfo>
                </div>
            </el-tab-pane>
            <el-tab-pane label="扶贫政策" name="second">
                <div class="content">
                    <HelpPoorInfo v-for="item in helpPoorArr" :key="item.id" :helpPoorArr="item" @goDetail="goDetail(item)">
                    </HelpPoorInfo>
                </div>
            </el-tab-pane>
        </el-tabs>
    </div>
</template>
<script>
import HelpPoorInfo from './help_poor_info/index.vue'
export default {
    name: 'Tab',
    components: {
        HelpPoorInfo
    },
    mixins: [],
    props: {

    },
    data() {
        return {
            activeName: 'first',
            type: 0,
            helpPoorArr: []
        }
    },
    computed: {

    },
    watch: {

    },
    mounted() {
        this.getConsultData(this.type)
    },
    methods: {
        handleClick(tab, event) {
            this.type = tab.index
            this.getConsultData(this.type)

        },
        getConsultData(type) {
            this.request.post('/helpPoorInfo/selectHelpPoorInfoPage', { type: type }).then(res => {
                if (res.code == 20000) {
                    this.helpPoorArr = res.data.list
                }
            })
        },
        goDetail(item) {
            this.$router.push({
                path: '/detail',
                query: {
                    id: item.id,
                    type: this.type
                }
            })
        }
    }
};
</script>
<style lang='less' scoped>
.tab {
    margin-top: -10px;
    height: 310px;

    .content {
        height: 257px;
        overflow-y: auto;
    }

}
</style>